<%--
    用户管理界面
    Author: scm
    Date: 2023-12-12
    Version: 1.0
--%>
<%--
    需要的数据
    userList 根据搜索框输入的username（可能不完整），返回查找到的所有符合的user
    如果搜索框没输入，则返回所有user

    currentPage 就是页面传入的参数page（具体见本页面“分页展示部分”）
    totalPage 总用户数/每页展示的用户数（我这里设置的10）

    传入的数据
    keyword 搜索的关键词（见搜索部分）
    page 当前页面号（见分页展示部分）
    id 被删除的userID（见删除按钮部分）
--%>

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="m" uri="/WEB-INF/tld/mytag.tld"%>
<%@ page session="true" %>
<%@ page contentType="text/html; charset=UTF-8" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="<c:url value="/resources/css/bootstrap.css"/>">
    <link rel="stylesheet" href="<c:url value="/resources/css/systemStyle.css"/>">
    <title>校园社团管理系统</title>
</head>
<body>
<!-- 顶部导航栏 -->
<jsp:include page="./header.jsp" />
<div class="content container">
    <!-- 搜索框  -->
    <nav class="navbar bg-body-tertiary">
        <div class="container-fluid">
            <div class="fs-4 fw-bolder">用户列表</div>
            <div>
                <c:if test="${!empty sessionScope.deleted}">
                    <c:choose>
                        <c:when test="${sessionScope.deleted}">
                            <span class="text-success">删除成功!</span>
                            <c:remove var="deleted" scope="session"/>
                        </c:when>
                        <c:otherwise>
                            <span class="text-danger">删除失败</span>
                            <c:remove var="deleted" scope="session"/>
                        </c:otherwise>
                    </c:choose>
                </c:if>
            </div>
            <form class="d-flex" role="search" action="<c:url value="../systemAdministrator/users" />" method="get">
                <input type="search" class="form-control me-2" placeholder="输入用户名" name="keyword" aria-label="Search">
                <button class="btn btn-outline-success text-nowrap" type="submit" id="search">搜索</button>
            </form>
        </div>
    </nav>
    <!-- user信息列表  -->
    <div class="list">
        <c:if test="${not empty userList}">
            <table class="table table-hover">
                <thead>
                <tr>
                    <th scope="col" class="text-center">用户名</th>
                    <th scope="col">昵称</th>
                    <th scope="col">创建时间</th>
                    <th scope="col">联系电话</th>
                    <th scope="col" colspan="2" class="text-center">操作</th>
                </tr>
                </thead>
                <c:forEach items="${userList}" var="user" varStatus="loop" begin="${(currentPage-1)*10}" end="${currentPage*10-1}">
                    <tr>
                        <th scope="row" class="text-center">${user.username}</th>
                        <td>${user.nickname}</td>
                        <td><fmt:formatDate value="${user.createTime}" pattern="yyyy/MM/dd HH:mm" /></td>
                        <td>${user.telephone}</td>
                        <td class="text-center">
                            <!-- 详细信息按钮 modal -->
                            <div >
                                <button type="button" class="btn btn-outline-secondary btn-sm" data-bs-toggle="modal" data-bs-target="#detailModel${loop.index}">
                                    详细信息
                                </button>
                                <div class="modal fade" id="detailModel${loop.index}" tabindex="-1" aria-labelledby="detailModelLabel" aria-hidden="true">
                                    <div class="modal-dialog">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <h1 class="modal-title fs-5" id="detailModelLabel">${user.nickname}的详细信息</h1>
                                                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                                            </div>
                                            <div class="modal-body">
                                                <m:showInfo user="${user}" identity="systemAdministrator"/>
                                            </div>
                                            <div class="modal-footer">
                                                <form action="<c:url value="../systemAdministrator/userInfo" />" method="get">
                                                    <input type="hidden" name="userID" value="${user.userID}" />
                                                    <input type="submit" class="btn btn-outline-danger" value="修改" />
                                                </form>
                                                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">关闭</button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </td>
                        <td>
                            <div>
                                <!-- 删除按钮  会返回一个userID用于在数据库删除这条数据-->
                                <form action="<c:url value="../systemAdministrator/users/delete" />" method="post">
                                    <input type="hidden" name="id" value="${user.userID}" />
                                    <input type="submit" class="btn btn-outline-danger" value="删除" />
                                </form>
                            </div>
                        </td>
                    </tr>
                </c:forEach>
            </table>
            <!-- 分页展示 -->
            <div class="d-flex justify-content-evenly">
                <c:if test="${currentPage > 1}">
                    <div class="pre-page">
                        <a href="<c:url value="../systemAdministrator/users?page=${currentPage - 1}" />" class="btn btn-outline-secondary">&lt; 上一页</a>
                    </div>
                </c:if>
                <c:if test="${currentPage <= 1}">
                    <div class="pre-page">
                        <a href="<c:url value="../systemAdministrator/users?page=${currentPage - 1}" />" class="btn btn-outline-secondary disabled">&lt; 上一页</a>
                    </div>
                </c:if>
                <p class="currentPage ">第 ${currentPage} 页</p>
                <c:if test="${currentPage < totalPage}">
                    <div class="next-page">
                        <a href="<c:url value="../systemAdministrator/users?page=${currentPage + 1}" />" class="btn btn-outline-secondary">下一页 &gt;</a>
                    </div>
                </c:if>
                <c:if test="${currentPage >= totalPage}">
                    <div class="next-page">
                        <a href="<c:url value="../systemAdministrator/users?page=${currentPage + 1}" />" class="btn btn-outline-secondary disabled">下一页 &gt;</a>
                    </div>
                </c:if>
            </div>
        </c:if>
        <c:if test="${empty userList}">
            <p class="text-center text-danger">无用户</p>
        </c:if>
    </div>
</div>
<jsp:include page="./footer.jsp" />
<script src="<c:url value="/resources/js/bootstrap.bundle.js" />"></script>
</body>
</html>